<template>
	<div class="drive-agreement-info">
		<div class="main_content">
			<div class="main_content_title">
				<div class="left">
					<template v-for="(item, index) in $route.meta.title">
						<span v-if="languageId === item.langId">{{ item.name }}</span>
					</template>
				</div>
				<div class="right">
				</div>
			</div>
			<div class="main_content_con">
				<el-form ref="info" :model="info" label-width="auto" class="demo-ruleForm">
					<div class="content_info">
						<el-row :gutter="24">
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.agreementCode')">
									<el-input readonly :value="info.agreementCode" />
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.latentName')">
									<el-input readonly :value="info.latentName" />
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.latentPhone')">
									<el-input readonly :value="info.latentPhone" />
								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="24">
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.accompanyPeople')">
									<el-input readonly :value="info.isAccompany === 1 ? $t('publicBtn.yes') : $t('publicBtn.no')" />
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.testDriveModel')">
									<el-input readonly :value="info.modelName" />
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item :label="$t('publicFormLabel.plateNumber')">
									<el-input readonly :value="info.carNumber" />
								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="24">
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.testDriver')">
									<el-input readonly :value="info.adviserName" />
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.testDriverTime')">
									<el-input readonly :value="info.createTime" />
								</el-form-item>
							</el-col>
						</el-row>
						<div class="line"></div>
						<el-row :gutter="24">
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.driverName')">
									<el-input readonly :value="info.driverName" />
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.sex')">
									<el-input readonly :value="info.driverSexName" />
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.quasiDrivingType')">
									<el-input readonly :value="info.driverModel" />
								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="24">
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.validityPeriod')">
									<el-input readonly :value="info.effectiveTime" />
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.driverLicense')">
									<el-input readonly :value="info.driverLicense" />
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.archivesCode')">
									<el-input readonly :value="info.archivesCode" />
								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="24">
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.drivingLicense')">
									<div class="avatar-uploader">
										<upload-img :preview="true" :defsrc="info.licenseImg" disabled />
									</div>
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item :label="$t('formLabel.signatureImg')">
									<div class="avatar-uploader">
										<upload-img :preview="true" :defsrc="info.signImg" disabled />
									</div>
								</el-form-item>
							</el-col>
						</el-row>
					</div>
					<div class="footerBtn">
						<el-button @click="getCancle">{{ $t('el.popconfirm.close') }}</el-button>
					</div>
				</el-form>
			</div>
		</div>
	</div>
</template>
<script>
import UploadImgSimple from '@/components/Upload/UploadImgSimple'
// import { getTestDriverInfo } from '@/api/commercial-vehicle-sales'
export default {
	name: '',
	components: {
		UploadImg: UploadImgSimple
	},
	data() {
		return {
			info: {}
		}
	},
	computed: {
		languageId() {
			// 固定语种ID  1:中文  2:英文 3:俄文 4:乌语
			return this.$store.getters.languageId
		}
	},
	watch: {},
	mounted() {
		window._vm = this
		this.propUpType = this.$route.query.propUpType
		// this.getInfo(this.$route.query.id)
	},
	created() { },

	activated() { },
	destroyed() { },
	methods: {
		// 详情
		getInfo(id) {
			getTestDriverInfo(id).then(res => {
				if (res.code === 200) {
					this.info = res.data
				}
			})
		},
		// 取消
		getCancle() {
			this.$store.state.tagsView.visitedViews.splice(
				this.$store.state.tagsView.visitedViews.findIndex(
					item => item.path === this.$route.path
				),
				1
			)
			this.$router.go(-1)
		}
	}
}
</script>
<style lang="scss" scoped>
.drive-agreement-info {
	height: 100%;
	width: 100%;
	padding: 20px;
	box-sizing: border-box;
	overflow: hidden;

	&>.main_content {
		width: 99.9%;
		height: 100%;

		&>.main_content_title {
			margin-bottom: 10px;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
		}

		.main_content_con {
			height: calc(100% - 40px);
			width: 100%;
			display: inline-block;
			border: 1px solid #dfe6ec;
			padding: 20px;
			overflow: hidden;

			&>.el-form {
				width: 100%;
				height: 100%;

				&>.content_info {
					width: 100%;
					height: calc(100% - 40px);
					overflow: hidden;
					overflow-y: auto;
				}

				.footerBtn {
					width: 100%;
					display: flex;
					justify-content: center;
				}
			}

			.line {
				height: 1px;
				margin-bottom: 25px;
				background: #ebeef5;
			}

			.el-button:hover,
			.el-button:focus {
				color: #000;
			}
		}
	}
}
</style>
